<?php
/**
 * Created by dutuwang.net
 * User: adophper <hello@adophper.com>
 * Date: 2018/3/30
 * Time: 17:24
 */
use yii\helpers\Html;
$this->title = '展览馆';
?>
<?=Html::cssFile('/static/frontend/css/hall.css')?>
<?=Html::jsFile('/static/frontend/js/swipe.js')?>
<div class="hall-index">
    <div class="hall-banner">
        <div class="contBox row f_relative clearfix">
            <div class="hall-hot pull-left">
                <div class="hall-hot-title"><span>热门展馆</span></div>
                <div class="hall-hot-list">
                    <?php
                    if (!empty($hot)) {
                        foreach ($hot as $val) {
                    ?>
                    <a href="<?=Yii::$app->urlManager->createUrl(['hall/detail', 'id' => $val['id']])?>"><?=$val['title']?></a>
                    <?php
                        }
                    }
                    ?>
                </div>
            </div>
            <div class="hall-slider pull-left">
                <div class="swipe" id="slider">
                    <div class="swipe-wrap">
                        <div class="clearfix">
                        <?php
                        if (!empty($banner)) {
                            $i = 1;
                            $countBanner = count($banner);
                            foreach ($banner as $val) {
                        ?>
                            <div class="slider-item">
                                <div class="slider-item-box">
                                    <a href="<?=Yii::$app->urlManager->createUrl(['hall/detail', 'id' => $val['id']])?>"><img src="<?=$val['hotpic']?>_300x470.jpg" onerror="this.src='/static/frontend/image/nohot.png'" /></a>
                                    <div class="slider-item-desc">
                                        <p class="slider-item-title"><?=$val['title']?></p>
                                        <p>地址：<?=$val['address']?></p>
                                        <p>面积：<?=$val['area']?>m²</p>
                                        <p>品牌展会</p>
                                    </div>
                                </div>
                            </div>
                        <?php
                                if ($i%3 == 0 && $i < $countBanner) {
                        ?>
                        </div><div class="clearfix">
                        <?php
                                }
                                $i++;
                            }
                        }
                        ?>
                        </div>
                    </div>
                </div>
            </div>

            <div class="hall-hot-nav hall-hot-left flex"><span class="hall-hot_left"><i class="glyphicon glyphicon-menu-left"></i></span></div>
            <div class="hall-hot-nav hall-hot-right flex"><span class="hall-hot_right"><i class="glyphicon glyphicon-menu-right"></i></span></div>

            <script>
                /*推荐城市展馆*/
                var slider = Swipe(document.getElementById('slider'), {
                    auto: 3000,
                    continuous: true
                });
                $(function(){
                    $(".hall-hot_left").click(function(e){
                        e.preventDefault();
                        slider.prev();
                    });
                    $(".hall-hot_right").click(function(e){
                        e.preventDefault();
                        slider.next();
                    });
                    $(".slider-item").on('mouseover', function (e) {
                        if (!$(this).hasClass('hover')) {
                            $(this).addClass('hover')
                        }
                    }).on('mouseout', function (e) {
                        if ($(this).hasClass('hover')) {
                            $(this).removeClass('hover')
                        }
                    })
                });
            </script>
        </div>
    </div>
    <div class="hall-box contBox clearfix" id="hall-box">
        <!--左边正文内容-->
        <div class="detailMin_box_min_left pull-left">
            <div class="nav-tabs-custom">
                <ul class="nav nav-tabs">
                    <li class="nav-title"><span>地区</span></li>
                    <li class="tab_city active" data-id=""><a href="#all" data-toggle="tab" aria-expanded="true">全部</a></li>
                    <?php
                    if (!empty($city)) {
                        foreach ($city as $val) {
                    ?>
                    <li class="tab_city" data-id="<?=$val['id']?>"><a href="#city_<?=$val['id']?>" data-toggle="tab" aria-expanded="false"><?=$val['name']?></a></li>
                    <?php
                        }
                    }
                    ?>
                </ul>
                <div class="tab-content" id="hall-list">

                    <div class="load-wrapp"><div class="load-9"><div class="spinner"><div class="bubble-1"></div><div class="bubble-2"></div></div></div></div>
                </div>
            </div>
        </div>
        <!--右侧直通车-->
        <div class="detailMin_box_min_right pull-right">
            <div class="img">
                <?=\frontend\widgets\Ad::widget(['position' => 'hall_list_right_ad'])?>
            </div>
            <div class="detailMin_box_min_right_title flex f_between f_relative">
                <i class="iconfont btn_red">&#xe6af;</i>
                <span>展会资讯</span>
                <a href="<?=Yii::$app->urlManager->createUrl(['news/index'])?>" class="more">更多&gt;&gt;</a>
            </div>
            <div class="foot_line"></div>
            <?= frontend\widgets\Exhibitionnews::widget()?>
            <!-- //谁来参展 -->
            <?= frontend\widgets\Exhibitor::widget()?>
        </div>
    </div>
</div>
<script>
$(function () {
    $(".tab_city").on('click', function (e) {
        e.preventDefault();
        if ($(this).hasClass('active')) {
            return false;
        }
        var regionId = $(this).data('id');
        $(".load-wrapp").show();
        $("#hall-list > .tab-pane").removeClass('active');
        if ($("#city_"+regionId).length > 0){
            $("#city_"+regionId).addClass('active');
            //return false;
            $(".load-wrapp").hide();
        }else{
            getCityHall(regionId);
        }
    })

    $("#hall-list").on('click', '.list-page a', function(e){
        e.preventDefault();
        //跳转到列表开始位置
        $("html, body").animate({
            scrollTop: $("#hall-box").offset().top + "px"
        }, {
            duration: 1000,
            easing: "swing"
        });
        $(".load-wrapp").show();
        var box = $(this).parents('.tab-pane').attr('id');
        $.get($(this).attr('href'), {}, function (response) {
            $("#"+box).remove();
            $("#hall-list").append(response);
            $(".load-wrapp").hide();
        });
        return false;
    })
})

function getCityHall(regionId){
    $.get('<?=Yii::$app->urlManager->createUrl(['hall/list'])?>', {regionId: regionId}, function(response){
        $("#hall-list").append(response);
        $(".load-wrapp").hide();
    })
}
getCityHall('');
</script>